let examination = [
    { img: '图片', frequency: '2021年语文第一次月考', introduce: '题目难度适宜', createp: '创建人', createname: '吴加好', createt: '创建时间', createtime: '2016-06-16 14:03', id: '1', sched: '20' },
    { img: '图片', frequency: '2021年语文第一次月考', introduce: '题目难度适宜', createp: '创建人', createname: '吴加好', createt: '创建时间', createtime: '2016-06-16 14:03', id: '2', sched: '100' },
    { img: '图片', frequency: '2021年语文第二次月考', introduce: '题目难度适宜', createp: '创建人', createname: '吴加好', createt: '创建时间', createtime: '2016-06-16 14:03', id: '3', sched: '70' },
    { img: '图片', frequency: '2021年语文第一次月考', introduce: '题目难度适宜', createp: '创建人', createname: '吴加好', createt: '创建时间', createtime: '2016-06-16 14:03', id: '4', sched: '40' },
    { img: '图片', frequency: '2021年语文第三次月考', introduce: '题目难度适宜', createp: '创建人', createname: '吴加好', createt: '创建时间', createtime: '2016-06-16 14:03', id: '5', sched: '50' },
    { img: '图片', frequency: '2021年语文第一次月考', introduce: '题目难度适宜', createp: '创建人', createname: '吴加好', createt: '创建时间', createtime: '2016-06-16 14:03', id: '6', sched: '100' },
    { img: '图片', frequency: '2021年语文第一次月考', introduce: '题目难度适宜', createp: '创建人', createname: '吴加好', createt: '创建时间', createtime: '2016-06-16 14:03', id: '6', sched: '90' },
    { img: '图片', frequency: '2021年语文第一次月考', introduce: '题目难度适宜', createp: '创建人', createname: '吴加好', createt: '创建时间', createtime: '2016-06-16 14:03', id: '6', sched: '30' },
];
let tableBG = document.querySelector('.table');
let paging = document.querySelector('.lwy-main-sect-paging ul');
let searchFor = document.querySelector('.lwy-main-sect-examinationinformation-nav-search');
let schedule = document.querySelectorAll('.nav-pill li');
let pageStripBelow = document.querySelector('.lwy-page-info');
let pageStripBelowS = document.querySelector('.lwy-page-info-span1');
let pageStripBelow2 = document.querySelector('.lwy-page-info2');
let pageStripBelow4 = document.querySelector('.lwy-page-info3');
let pageStripBelow3 = document.querySelector('.lwy-main-sect-dropDown-a1');
let pageStripBelow7 = document.querySelector('.lwy-main-sect-dropDown-a2');
let pageStripBelow5 = document.querySelector('.lwy-main-sect-dropDown-li2');
let pageStripBelow6 = document.querySelector('.lwy-main-sect-dropDown-li1');
let count = 5;
let iNow = 1;
// 随机数
// function number(m, n) {
//     return Math.floor(Math.random() * (n - m + 1)) + m;

// };
// 页面与页面渲染
function render(arr) {

    let str = '';
    let renderDate = arr.slice((iNow - 1) * count, iNow * count);
    for (let i = 0; i < renderDate.length; i++) {
        // let o=number(0,100);
        str += `<tr>
    <td>${renderDate[i].img}</td>
    <td>
        <p>${renderDate[i].frequency}</p>
        <p>${renderDate[i].introduce}</p>
    </td>
    <td>
        <p>${renderDate[i].createp}</p>
        <p>${renderDate[i].createname}</p>
    </td>
    <td>
        <p>${renderDate[i].createt}</p>
        <p>${renderDate[i].createtime}</p>
    </td>
    <td data-id="${renderDate[i].id}">
        <div class="progress">
            <div class="progress-bar progress-bar-info sArr" role="progressbar"
                aria-valuenow="20" aria-valuemin="0" aria-valuemax="100" style="width:${renderDate[i].sched}%">
                ${renderDate[i].sched}%
            </div>
        </div>
    </td>
    <td><a href="../pages/examination-details.html">详情</a></td>
    </tr>`
    };
    tableBG.innerHTML = str;
    // 创建分页
    let pageLeft = ` <li>
    <a class="left" href="#" aria-lable="Previous><span  class="left " aria-hidden="true"><span class="glyphicon glyphicon-menu-left  left"></span></span>
    </a></li>`;
    let pagesRight = `<li>
    <a  class="right" href="#" aria-label="Next">
    <span  class="right glyphicon glyphicon-menu-right" aria-hidden="true"></span>
    </a>
    </li>`;
    let pagesStr = '';
    for (let i = 1; i <= Math.ceil(arr.length / count); i++) {
        if (iNow == i) {
            pagesStr += `<li class="active"><a href="#">${i}</a></li>`;
        } else {
            pagesStr += `<li><a href="#">${i}</a></li>`;
        };
    };
    paging.innerHTML = pageLeft + pagesStr + pagesRight;
}
render(examination);
// 分页点击功能
pageStripBelow.addEventListener('click', function () {
    if (pageStripBelow4.style.display == 'none') {
        pageStripBelow4.style.display = 'block';
    } else {
        pageStripBelow4.style.display = 'none';
    };
});
pageStripBelow5.addEventListener('click', function () {
    count = pageStripBelow3.innerHTML
    if (pageStripBelow3.innerHTML == '4' && pageStripBelowS.innerHTML == '5条/页') {
        pageStripBelowS.innerHTML = '4条/页';
        pageStripBelow3.innerHTML = '5'
    } else {
        pageStripBelowS.innerHTML = '5条/页';
        pageStripBelow3.innerHTML = '4'
    }
    render(examination);
});
pageStripBelow6.addEventListener('click', function () {
    count = pageStripBelow7.innerHTML
    if (pageStripBelow7.innerHTML == '3' && pageStripBelowS.innerHTML == '5条/页') {
        pageStripBelowS.innerHTML = '3条/页';
        pageStripBelow7.innerHTML = '5'
    } else {
        pageStripBelowS.innerHTML = '5条/页';
        pageStripBelow7.innerHTML = '3'
    }
    render(examination);
});
function pan(e) {
    if (e.target.className.includes('left')) {
        if (iNow > 1) {
            iNow--;
        }
    } else if (e.target.className.includes('right')) {
        if (iNow < Math.ceil(examination.length / count)) {
            iNow++;
        }
    } else {
        iNow = e.target.innerText.trim();
    }
    render(examination);
};
function pan1(e) {
    if (e.target.className.includes('left')) {
        if (iNow > 1) {
            iNow--;
        }
    } else if (e.target.className.includes('right')) {
        if (iNow < Math.ceil(examination.length / count)) {
            iNow++;
        }
    } else {
        iNow = e.target.innerText.trim();
    }
    render(schedArr);
}
function pan2(e) {
    if (e.target.className.includes('left')) {
        if (iNow > 1) {
            iNow--;
        }
    } else if (e.target.className.includes('right')) {
        if (iNow < Math.ceil(examination.length / count)) {
            iNow++;
        }
    } else {
        iNow = e.target.innerText.trim();
    }
    render(schednArr);
}
function pan3(e) {
    if (e.target.className.includes('left')) {
        if (iNow > 1) {
            iNow--;
        }
    } else if (e.target.className.includes('right')) {
        if (iNow < Math.ceil(specificArr.length / count)) {
            iNow++;
        }
    } else {
        iNow = e.target.innerText.trim();
    }
    render(specificArr);
}
paging.addEventListener('click', pan);
pageStripBelow2.addEventListener('blur', function () {
    if (pageStripBelow2.value == '') {

    } else {
        iNow = pageStripBelow2.value;
        render(examination);
    }

});
// 搜索
let specificArr;
searchFor.addEventListener('click', function () {
    iNow=1;
    specificArr = [];
    let searchInput = document.querySelector('.lwy-main-sect-examinationinformation-nav-searchi').value;
    for (let i = 0; i < examination.length; i++) {
        if (searchInput == examination[i].frequency) {
            specificArr.push(examination[i])
        }
    }
    paging.removeEventListener('click', pan)
    paging.addEventListener('click', pan3)
    render(specificArr);
});
let schedArr;
let schednArr;
// 进度
for (let j = 0; j < schedule.length; j++) {
    schedule[0].addEventListener('click', function () {
        schedule[0].classList.add('nav-pill-li-cclor');
        schedule[1].classList.remove('nav-pill-li-cclor');
        schedule[2].classList.remove('nav-pill-li-cclor');
        paging.removeEventListener('click', pan1);
        paging.removeEventListener('click', pan2);
        paging.addEventListener('click', pan);
        render(examination)
    });
    schedule[1].addEventListener('click', function () {
        schedule[1].classList.add('nav-pill-li-cclor');
        schedule[0].classList.remove('nav-pill-li-cclor');
        schedule[2].classList.remove('nav-pill-li-cclor');
        schedArr = [];
        for (let i = 0; i < examination.length; i++) {
            if (examination[i].sched != 100) {
                schedArr.push(examination[i]);
            };
        };
        paging.addEventListener('click', pan1);
        paging.removeEventListener('click', pan);
        render(schedArr);
    });
    schedule[2].addEventListener('click', function () {
        schedule[2].classList.add('nav-pill-li-cclor');
        schedule[0].classList.remove('nav-pill-li-cclor');
        schedule[1].classList.remove('nav-pill-li-cclor');
        schednArr = [];
        for (let i = 0; i < examination.length; i++) {
            if (examination[i].sched == 100) {
                schednArr.push(examination[i]);
            }
        };
        paging.addEventListener('click', pan2);
        paging.removeEventListener('click', pan);
        render(schednArr)
    });

    // schedule[j].onclick = function (e) {
    //     let schedArr = [];
    //     let schednArr = [];
    //     for (let j = 0; j < schedule.length; j++) {
    //         schedule[j].classList.remove('nav-pill-li-cclor');
    //     }
    //     this.classList.add('nav-pill-li-cclor');
    //     for (let i = 0; i < examination.length; i++) {
    //         if (examination[i].sched != 100) {
    //             schedArr.push(examination[i]);
    //         } else {
    //             schednArr.push(examination[i]);
    //         }
    //     };
    //     this.render(schedArr);
    //     this.render(schednArr);
    // };
};
